<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core">
    <body>
        <ui:composition template="/WEB-INF/templates/default_template.xhtml">
            <ui:define name="contenido">
                <h:panelGrid cellspacing="15" width="100%">
                    <h:outputText value="Guiones Técnico" styleClass="titulo" />
                    <p:panel>
                        <h:form id="formEscenas">
                            <h:panelGrid cellspacing="5" width="100%">
                                <h:panelGrid columns="4">
                                    <h:outputText value="Descripción: " styleClass="etiqueta" />
                                    <h:outputText value="Actores: " styleClass="etiqueta" />
                                    <h:outputText value="Locaciones: " styleClass="etiqueta" />
                                    <h:outputText />
                                    <p:inputText size="40" />
                                    <p:inputText size="40" />
                                    <p:inputText size="40" />
                                    <p:commandButton value="Buscar" icon="icono-buscar" />
                                </h:panelGrid>
                                <p:commandButton value="Nuevo Guión" oncomplete="registrar.show();" icon="icono-agregar" />
                                <p:dataTable id="dataTable" value="#{preGuiones.escenas}" var="escena" paginator="true" rows="10" rowsPerPageTemplate="10,20,50" paginatorPosition="bottom" emptyMessage="No hay datos para mostrar" rowStyleClass="encima" rowIndexVar="i">
                                    <p:column headerText="Nro" width="20">
                                        <h:outputText value="#{i+1}" />
                                    </p:column>
                                    <p:column headerText="Escena">
                                        <h:outputText value="#{escena.txt_nombre}" />
                                    </p:column>
                                    <p:column headerText="Fecha">
                                    </p:column>
                                    <p:column headerText="Actores">
                                    </p:column>
                                    <p:column headerText="Locación">
                                    </p:column>
                                    <p:column width="60">
                                        <p:commandButton title="Editar" oncomplete="registrar.show();" icon="icono-editar">
                                            <f:setPropertyActionListener target="#{preLocacionesBean.locacion}" value="#{locacion}" />
                                        </p:commandButton>
                                        <p:commandButton title="Eliminar" icon="icono-eliminar" action="#{preLocacionesBean.eliminarLocacion(locacion)}">
                                            <p:confirm header="ELIMINAR LOCACION" message="Va a eliminar el registro. ¿Desea continuar?" icon="icono-eliminar" />
                                        </p:commandButton>
                                    </p:column>
                                </p:dataTable>
                            </h:panelGrid>
                        </h:form>
                        <h:form id="formEscena">
                            <p:dialog widgetVar="registrar" header="REGISTRO DE ESCENA" resizable="false" modal="true">
                                <p:tabView id="tabs">
                                    <p:tab id="datos" title="Datos">
                                        <h:panelGrid>
                                            <h:outputText value="Fecha: " styleClass="etiqueta" />
                                            <p:calendar pattern="dd/MM/yyyy" timeZone="GMT-5" readonlyInput="true" showOn="button" size="10" />
                                            <h:outputText value="Nombre: " styleClass="etiqueta" />
                                            <p:inputText size="51" />
                                            <h:outputText value="Resumen: " styleClass="etiqueta" />
                                            <p:inputTextarea cols="50" rows="15" autoResize="false" />
                                        </h:panelGrid>
                                    </p:tab>
                                    <p:tab id="actores" title="Actores">
                                        <h:panelGrid width="100%">
                                            <p:commandButton value="Agregar Actor" icon="icono-agregar" />
                                            <p:dataTable value="" var="actor" rows="10" paginatorPosition="bottom" rowsPerPageTemplate="10,20" emptyMessage="No hay datos que mostrar">
                                                <p:column headerText="Nombre">
                                                </p:column>
                                                <p:column headerText="Edad">
                                                </p:column>
                                                <p:column width="30">
                                                    <p:commandButton title="Quitar" icon="icono-eliminar" />
                                                </p:column>
                                            </p:dataTable>
                                        </h:panelGrid>
                                    </p:tab>
                                    <p:tab id="locacion" title="Locación">
                                        <h:panelGrid columns="2" cellspacing="5">
                                            <h:outputText value="Nombre: " styleClass="etiqueta" />
                                            <p:selectOneMenu>
                                                <f:selectItem itemLabel="SELECCIONAR" itemValue="0" />
                                                <f:selectItems value="#{preLocacionesBean.locaciones}" var="locacion" itemLabel="#{locacion.txt_nombre}" itemValue="#{locacion.cod_locacion}" />
                                            </p:selectOneMenu>
                                        </h:panelGrid>
                                        <p:galleria value="#{galleriaBean.images}" var="image" panelWidth="340" panelHeight="280">
                                            <p:graphicImage value="/images/galleria/#{image}" alt="Image Description for #{image}" title="#{image}"/>  
                                        </p:galleria>
                                    </p:tab>
                                    <p:tab id="utileria" title="Utileria">  
                                        <h:panelGrid width="100%">
                                            <p:commandButton value="Agregar Utileria" icon="icono-agregar" />
                                            <p:dataTable value="" var="utileria" rows="10" paginatorPosition="bottom" rowsPerPageTemplate="10,20" emptyMessage="No hay datos que mostrar">
                                                <p:column headerText="Nombre">
                                                </p:column>
                                                <p:column headerText="Categoria">
                                                </p:column>
                                                <p:column headerText="Estado">
                                                </p:column>
                                                <p:column headerText="Color">
                                                </p:column>
                                                <p:column width="30">
                                                    <p:commandButton title="Quitar" icon="icono-eliminar" />
                                                </p:column>
                                            </p:dataTable>
                                        </h:panelGrid>
                                    </p:tab>
                                    <p:tab id="vestuario" title="Vestuario">  
                                        <h:panelGrid width="100%">
                                            <p:commandButton value="Agregar Vesturario" icon="icono-agregar" />
                                            <p:dataTable value="" var="vestuario" rows="10" paginatorPosition="bottom" rowsPerPageTemplate="10,20" emptyMessage="No hay datos que mostrar">
                                                <p:column headerText="Actor">
                                                </p:column>
                                                <p:column headerText="Vestuario">
                                                </p:column>
                                                <p:column headerText="Observaciones">
                                                </p:column>
                                                <p:column width="30">
                                                    <p:commandButton title="Quitar" icon="icono-eliminar" />
                                                </p:column>
                                            </p:dataTable>
                                        </h:panelGrid>
                                    </p:tab>
                                </p:tabView>
                                <p:separator />
                                <h:panelGrid columns="2">
                                    <p:commandButton value="GUARDAR" icon="icono-guardar" />
                                    <p:commandButton value="Cancelar" type="button" onclick="registrar.hide();" icon="icono-salir" />
                                </h:panelGrid>
                            </p:dialog>
                        </h:form>
                    </p:panel>
                </h:panelGrid>
            </ui:define>
        </ui:composition>
    </body>
</html>
